<template>
  <view class="bg-white padding-xs margin radius-lg solid-bottom">
    <view v-if="inquiryItem">
      <view class="flex flex-sub justify-between align-center padding-xs">
        <view>
          <MrAvatar :src="inquiryItem.avatar" :size="100"></MrAvatar>
        </view>
        <view class="flex flex-sub margin-left-xs flex-direction">
          <view class="text-lg text-bold  padding-tb-xs"> {{ inquiryItem.name }}</view>
          <view class="text-gray text-df"> 发布于{{ inquiryItem.createTime }}</view>
        </view>
      </view>
      <view class="flex flex-sub flex-direction padding-lr  radius-lg">
        <view class="text-cut padding-lr padding-xs ">
          {{ inquiryItem.content }}
        </view>
        <view class="grid col-4 grid-square flex-sub  ">
          <view v-if="inquiryItem.images.length" class="bg-img" v-for="(item,index) in inquiryItem.images"
                :key="index" @tap.stop="viewImage(inquiryItem.images,item)">
            <MrImage :src="item"></MrImage>
          </view>
        </view>
      </view>
    </view>
  </view>


</template>

<script setup lang="ts">
import {defineProps, ref} from "vue";
import MrAvatar from "@/components/common/MrAvatar.vue";
import MrImage from "@/components/common/MrImage.vue";
import {imagePathPrefix} from "/settings";
const props = defineProps({
  inquiryItem: {
    type: Object,
    default: {}
  }
})

const commentList = ref()
const prefix = imagePathPrefix

const viewImage = (images: any, image: any) => {
  let tmp = JSON.parse(JSON.stringify(images))
  Object.keys(tmp).forEach(key => {
    tmp[key] = prefix + tmp[key]
  })
  uni.previewImage({
    urls: tmp,
    current: image
  })
}
</script>

<style scoped>

</style>